<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="UTF-8">
		<title>图书列表</title>
		<link type="text/css" rel="stylesheet" th:href="@{/dist/css/bootstrap.min.css}">
		<link rel="stylesheet" type="text/css" th:href="@{/css/index.css}" />
		<link rel="stylesheet" type="text/css" th:href="@{/css/animate.css}" />
	</head>
	<body>
		<!--导航部分  begin-->
		<div th:replace="common/bookAll::header"></div>
		<!--导航部分 end-->

		<!--最顶端轮播图片 begin-->
		<div th:replace="common/bookAll::carousel"></div>
		<!--最顶端轮播图片 end-->

		<div class="container">	
			<ol class="breadcrumb">
			    <li><a href="#">图书列表</a></li>
			    <li><a href="#">精选图书</a></li>
			</ol>
		</div>
		
		<!--展示数据和分页开始-->
		<div id="bookList"></div>
		<!--展示数据和分页结束-->

		<!--地址-->
		<div class="container">
		<hr>
			<div th:replace="common/bookAll::footer"></div>
		</div>
		<!--end-->

		<!--登录注册模态框-->
		<div th:replace="common/bookModal::bookModal"></div>

	<script th:src="@{/dist/js/jquery.min.js}"></script>
	<script th:src="@{/js/carousel.js}" type="text/javascript" charset="utf-8"></script>
	<script th:src="@{/dist/js/bootstrap.min.js}"></script>
	<script th:src="@{/js/wow.js}"></script>
	<script th:src="@{/js/login_reg.js}"></script>
	<script th:src="@{/js/sweetalert.min.js}"></script>
		<script th:inline="javascript">
		//获取网站的虚拟路径
		var contextPath = [[${#request.getContextPath()}]];
		var category = [[${category}]];
		var pSize = [[${pageSize}]];
		var pPages = [[${pages}]];
	</script>
	<script type="text/javascript">
		if(!(/msie [6|7|8|9]/i.test(navigator.userAgent))) {
			new WOW().init();
		};

		//显示图书的详细信息
		$(function () {
			$("#bookList").load(contextPath + "/book/getBookListData",queryData(1,'',category))
		})

		function queryData(page,pageSize,category){
			var query = {};
			query.category = category;
			query.page = page;
			query.pageSize = pageSize == '' ? pSize:pageSize;
			return query;
		}

		function loadData(page,pageSize,category){
			$("#bookList").load(contextPath + "/book/getBookListData",queryData(page,pageSize,category))
		}

		//跳转到指定也
		function goPage(pageSize,category){
			var page = $("#inputPage").val();
			if (page > pPages){
				page=1;
			}
			$("#bookList").load(contextPath + "/book/getBookListData",queryData(page,pageSize,category))
		}

		//修改每页的条数
		function loadDataBySize(obj) {
			$("#bookList").load(contextPath + "/book/getBookListData",queryData(1,obj.value,category))
		}

	</script>
	</body>
</html>
